// 1. 读取 index.html，得到字符串
// 2. 使用正则表达式，获取到css代码，使用 单独的index.css，保存
// 3. 使用正则表达式，获取到js代码，使用 单独的index.js，保存
// 4. 替换style标签为link标签、替换script标签为 <script src="">

const fs = require("fs");
const path = require("path");

// 拼接各个文件的绝对路径
let oldHtml = path.join(__dirname, "index.html");
let newHtml = path.join(__dirname, "abc", "index.html");
let cssPath = path.join(__dirname, "abc", "index.css");
let jsPath = path.join(__dirname, "abc", "index.js");

// 1. 读取 index.html，得到字符串
fs.readFile(oldHtml, "utf-8", (err, data) => {
    if (err) return console.log(err);
    // 读取没有错误，说明读取成功了
    // 2. 使用正则表达式，获取到css代码，使用 单独的index.css，保存
    let cssReg = /<style>([\s\S]*)<\/style>/g;
    let cssResult = cssReg.exec(data); // ['带style标签的全部样式代码', '不带style标签的全部样式代码', ...]
    console.log(cssResult[1]);
    fs.writeFile(cssPath, cssResult[1], (err) => {
        if (err) return console.log(err);
        console.log("css分离成功");
    });

    // 3. 使用正则表达式，获取到js代码，使用 单独的index.js，保存
    let jsReg = /<script>([\s\S]*)<\/script>/g;
    let jsResult = jsReg.exec(data); // ['带style标签的全部样式代码', '不带style标签的全部样式代码', ...]
    console.log(jsResult[1]);
    fs.writeFile(jsPath, jsResult[1], (err) => {
        if (err) return console.log(err);
        console.log("js分离成功");
    });

    // 4. 替换style标签为link标签、替换script标签为 <script src="">
    data = data.replace(cssReg, '<link rel="stylesheet" href="index.css">');
    data = data.replace(jsReg, '<script src="index.js"></script>');

    fs.writeFile(newHtml, data, (err) => {
        if (err) return console.log(err);
        console.log("html保存成功");
    });
});